<!--
 * @Description: file content
 * @Author: oooh
 * @Date: 2024-04-26 11:16:35
 * @LastEditors: oooh
 * @LastEditTime: 2024-09-02 11:53:45
 * @FilePath: \Civil_Servant_Performance_PC\src\views\work\democratic-evaluation\index.vue
-->
<template>
  <div class="app-container">
    <el-row>
      <el-col>
        <el-select v-model="queryParams.year" placeholder="请选择" @change="handleYearChange">
          <el-option v-for="item in dict.type.biz_work_year_list" :key="item.value" :label="item.label" :value="item.value"> </el-option>
        </el-select>
        <el-select v-model="queryParams.quarter" placeholder="请选择" class="ml-10" @change="handleQuarterChange">
          <el-option v-for="item in quarterOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
        </el-select>
      </el-col>
    </el-row>
    <div class="text-banner">
      <span>民主测评表</span>
      <el-button class="ml-10" size="mini" type="primary" circle icon="el-icon-refresh" plain @click="handleRefresh" />
    </div>
    <el-button
      icon="el-icon-s-claim"
      size="mini"
      type="primary"
      plain
      @click="handleSubmit"
      class="float-right mb-10"
      :disabled="!tableList.length"
      v-hasPermi="['work:democratic-evaluation:submit']"
      >保存并提交</el-button
    >
    <el-table :data="tableList" border style="width: 100%" height="100%" v-loading="loading">
      <el-table-column label="序号" type="index" align="center">
        <template slot-scope="scope">
          <span>{{ scope.$index + 1 }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="civilServantName" label="评分对象" min-width="160" align="center" show-overflow-tooltip> </el-table-column>
      <el-table-column :label="`得分（满分${maxScore}分）`" prop="score" align="center">
        <template slot-scope="scope">
          <el-input-number
            v-model="scope.row.score"
            placeholder="分值"
            controls-position="right"
            :min="0"
            :max="parseInt(maxScore)"
          ></el-input-number>
        </template>
      </el-table-column>
      <el-table-column label="备注" prop="remarks" align="center">
        <template slot-scope="scope">
          <el-input
            v-model="scope.row.remarks"
            type="textarea"
            placeholder="输入备注内容"
            :rows="1"
            :autosize="{ minRows: 1, maxRows: 5 }"
          ></el-input>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { list, edit } from '@/api/work/democratic-evaluation'
import { getDicts } from '@/api/system/dict/data.js'
import { quarterFormat, quarterToMonth } from '@/utils/quarter.js'

export default {
  name: 'work_democratic-evaluation',
  dicts: ['biz_work_year_list'],
  props: {},
  components: {},
  data() {
    return {
      maxScore: 0,
      loading: false,
      quarterOptions: [],
      tableList: [],
      queryParams: {
        year: '',
        quarter: ''
      }
    }
  },
  computed: {},
  created() {
    this.getMaxScore()
    this.handleYearChange(new Date().getFullYear())
  },
  methods: {
    // 年度选择
    handleYearChange(year) {
      this.queryParams.year = year
      // 获取当前季度、季度列表（往年默认第一季度）
      let { quarter, quarterList } = quarterFormat(year)
      this.quarterOptions = quarterList
      this.handleQuarterChange(quarter)
    },
    // 季度选择
    handleQuarterChange(quarter) {
      this.queryParams.quarter = quarter
      // 获取季度对应月份
      this.keyWork = quarterToMonth(quarter).map(month => {
        return { month, score: 0, list: [] }
      })
      this.getList()
    },
    // 获取民主测评最大分数
    getMaxScore() {
      getDicts('biz_personal_norm_config').then(res => {
        let { data } = res
        this.maxScore = data.find(item => item.dictValue === 'PJCP_MZCP')?.remark
      })
    },
    handleSubmit() {
      let params = { year: this.queryParams.year, quarter: this.queryParams.quarter, scoreList: this.tableList }
      edit(params).then(res => {
        this.$modal.msgSuccess('已提交')
        this.handleRefresh()
      })
    },
    getList() {
      this.loading = true
      list(this.queryParams)
        .then(res => {
          this.loading = false
          this.tableList = res.rows
        })
        .catch(err => (this.loading = false))
    },
    // 刷新
    handleRefresh() {
      this.getList()
    }
  }
}
</script>

<style lang="scss">
.el-input-number--medium {
  width: auto;
}
</style>
